<template>
  <div class="promoter-order">
    <ContentBox title="推广订单" @left="back" :fixed="true" :ostyle="style" titlecolor="block">
      <template slot="oleft"><van-icon color="#000" name="arrow-left"/></template>
    </ContentBox>
    <notice :top="$remToPx('0.88')"></notice>
    <div class="promoterHeader">
      <div class="headerCon acea-row row-between-wrapper" :style="{backgroundImage:`url(${$img('transparent.png')})`}">
        <div>
          <div class="name">累计推广订单</div>
          <div class="money">
            <span class="num">{{listData.count}}&nbsp;</span>单
          </div>
        </div>
        <div class="price" :style="{backgroundImage:`url(${$img('note.png')})`}"></div>
      </div>
    </div>
    <div class="list">
      <div class="item" v-for="(item, index) in listData.list" :key='index'>
        <div class="title acea-row row-column row-center">
          <div class="data">{{item.time}}</div>
          <div>本月累计推广订单：{{item.count}}单</div>
        </div>
        <div class="listn" v-for="(item1, index1) in item.child" :key="index1">
          <div class="itenm">
            <div class="top acea-row row-between-wrapper">
              <div class="pictxt acea-row row-between-wrapper">
                <div class="pictrue">
                  <img :src="item1.avatar"/>
                </div>
                <div class="text line1">{{item1.nickname}}</div>
              </div>
              <div class="money">
                返佣：<span class="font-color-red"
                  >￥{{item1.number}}</span
                >
              </div>
            </div>
            <div class="bottom">
              <div><span class="name">订单号：</span>{{item1.order_id}}</div>
              <div><span class="name">下单时间：</span>{{item1.time}}</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
      style: {
        backgroundColor: '#f6f6f6'
      },
      num: 1,
      listData: ''
    }
  },
  methods: {
    back () {
      this.$router.go(-1)
    },
    getData () {
      this.$axios.post('/api/spread/order').then(res => {
        if (res.status === 200) {
          this.listData = res.data
        }
      })
    },
    getAllData () {
      this.$axios.get('/api/commission').then(res => {
        if (res.status === 200) {
          this.mData = res.data
        }
      })
    }
  },
  created () {
    this.getData()
  }
}
</script>

<style lang="scss" scoped>
@import './index.scss';
</style>
